<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>

<html>
<f:view>
	<head>
	<title>My events</title>
<style type="text/css">
  .orders {
     border: 2px solid black; 
  }
  .ordersHeader {
     text-align: center;
     font-style: italic;
     color: Snow;
     background: Teal;
  }
  .oddRow {
     height: 25px;
     text-align: center;
     background: MediumTurquoise;
  }
  .evenRow {
     text-align: center;
     background: PowderBlue;
  }
  .dateColumn {
  	width: 200px;
  }
  .nameColumn {
  	width: 300px;
  }
  </style>
	</head>

	<body>
	<h1>		
		<h:outputText value="My Events" />
	</h1>
	
 	<h:messages errorStyle="color: #ff0000" globalOnly="true"/>


	<h:form id="myEventsForm">
		<hr />
		<h:panelGrid columns="6">
		
			<h:outputText value="#{myEventsController.user.emailAddress}" />
				
			<h:outputText value="&nbsp;&nbsp;-&nbsp;&nbsp;" escape="false" />
			<h:commandLink action="#{homeController.home}">
				<f:param value="#{myEventsController.user.id}" name="userId" />
				<h:outputText value="Home" />
			</h:commandLink>
			<h:commandLink action="#{myEventsController.listMyEvents}">
				<f:param value="#{myEventsController.user.id}" name="userId" />
				<h:outputText value="My Events" />
			</h:commandLink>
			<h:commandLink action="#{manageAccountController.manageAccount}">
				<f:param value="#{myEventsController.user.id}" name="userId" />
				<h:outputText value="My Account" />
			</h:commandLink>
			<h:commandLink action="#{loginController.logout}">
				<h:outputText value="Log Out" />
			</h:commandLink>
		</h:panelGrid>
		<hr />
			<h:outputText value="<br/>" escape="false"/>
             
			 <h:outputText id="summary"/>
             	<h:message for="summary" style="color: Red" />
             	<h:outputText value="<br/>" escape="false"/>
             
	<h2>
		<h:panelGroup>
			<h:outputText value="Events (" />
			<h:outputText value="#{myEventsController.size}" />
			<h:outputText value="):" />
		<h:commandLink action="#{eventController.newEvent}">
			<f:param value="#{myEventsController.user.id}" name="userId" />
			<h:outputText value="Create a new event." />
		</h:commandLink>			
		</h:panelGroup>
	</h2>

		<h:dataTable value="#{myEventsController.events}" var="event"
			styleClass="orders"
     		headerClass="ordersHeader"
     		columnClasses="dateClass,nameClass"
    	 	rowClasses="oddRow,evenRow">
			            <h:column>
                <f:facet name="header"><h:outputText value="Date" /> </f:facet>
                <h:outputText value="#{event.startDate}">
                	<f:convertDateTime pattern="MM/dd/yyyy"/>
                </h:outputText>
            </h:column>
            <h:column>
                <f:facet name="header"><h:outputText value="Name" /> </f:facet>
                <h:outputText value="#{event.name}" />
            </h:column>
            <h:column>
                <h:commandLink action="#{eventController.editEventDetail}" value="Edit Event Detail">
                    <f:param value="#{event.id}" name="eventId" />
                    <f:param value="#{myEventsController.user.id}" name="userId" />
                </h:commandLink>
            </h:column>
		</h:dataTable>
	</h:form>
	</body>
</f:view>
</html>